<template>
	<view>
		<!-- 页面内容开始 -->
		<!-- 表格搜索组件开始 -->
		<vk-data-table-query
			v-model="queryForm1.formData"
			:columns="queryForm1.columns"
			size="mini"
			@search="search"
		></vk-data-table-query>
		<!-- 表格搜索组件结束 -->
		<view>
		<el-button type="success" size="small" icon="el-icon-circle-plus-outline" @click="addBtn">添加</el-button>
		</view>
		<!-- 表格组件开始 -->
		<vk-data-table
			ref="table1"
			:action="table1.action"
			:columns="table1.columns"
			:query-form-param="queryForm1"
			:right-btns="['detail_auto','update','delete']"
			:selection="false"
			:row-no="true"
			:pagination="true"
			size="mini"
			@update="updateBtn"
			@delete="deleteBtn"
			@current-change="currentChange"
			@selection-change="selectionChange"
		></vk-data-table>
		<!-- 表格组件结束 -->
		<!-- 添加或编辑的弹窗开始 -->
		<vk-data-dialog
			v-model="formData1.show"
			:title="formData1.title"
			width="500px"
			center
			:close-on-click-modal="true"
		>
			<vk-data-form
				v-model="form1"
				:rules="formData1.rules"
				:action="formData1.action"
				:form-type="formData1.formType"
				:columns='formData1.columns'
				label-width="120px"
				@success="formData1.show = false;refresh();"
			></vk-data-form>
		</vk-data-dialog>
		<!-- 添加或编辑的弹窗结束 -->


		<!-- 页面内容结束 -->
	</view>
</template>

<script>
	var that;													// 当前页面对象
	var vk = uni.vk;									// vk实例
	export default {
		props: {
			user:{
				Type:Object,
			}
		},
		data: function() {
			// 组件创建时,进行数据初始化
			return {
				// 页面是否请求中或加载中
				loading:false,
				// init请求返回的数据
				data:{

				},
				// 表格相关开始 -----------------------------------------------------------
				table1:{
					// 表格数据请求地址
					action:"admin/business/sys/user.getUserWithdrawalWay",
					// 表格字段显示规则
					columns:[
						{ key:"type", title:"提现方式", type:"tag", width:120,
							data:[
								{ value:1, label:"支付宝", tagType:"" },
								{ value:2, label:"微信", tagType:"success" },
								{ value:3, label:"银行卡", tagType:"danger" }
							]
						},
						{ key:"account_no", title:"提现账户", type:"text", width:200 },
						{ key:"name", title:"提现人姓名", type:"text", width:120 },
						{ key:"mobile", title:"提现人手机号", type:"text", width:120 },
						{ key:"bank_name", title:"银行名称", type:"text", width:120 },
						{ key:"bank_open", title:"开户行", type:"text", width:150 },
						{ key:"is_default", title:"是否默认", type:"tag", width:90,defaultValue:false,
							data:[
								{ value:true, label:"是", tagType:"success" },
								{ value:false, label:"否", tagType:"danger" }
							]
						},
						{ key:"verified", title:"通过验证", type:"tag", width:90,defaultValue:false,
							data:[
								{ value:true, label:"是", tagType:"success" },
								{ value:false, label:"否", tagType:"danger" }
							]
						},
						{ key:"comment", title:"用户备注", type:"text", width:220 },
						{ key:"_add_time", title:"添加时间", type:"time", width:180 },
						{ key:"_id", title:"id", type:"text", width:280 },
					],
					// 多选框选中的值
					multipleSelection:[],
					// 当前高亮的记录
					selectItem:"",
				},
				// 表格相关结束 -----------------------------------------------------------
				// 表单相关开始 -----------------------------------------------------------
				// 查询表单请求数据
				queryForm1:{
					// 查询表单数据源，可在此设置默认值
					formData:{

					},
					// name,					 //收货人姓名
					// mobile,        //收货人手机号
					columns:[
						{ key:"name", title:"提现人姓名", type:"text", width: 200, mode:"%%" },
						{ key:"mobile", title:"提现人手机", type:"text", width: 200, mode:"%%" },
						{ key:"_add_time", title:"添加时间", type:"datetimerange", width: 320, mode:"[]" },
						{ key: "user_id", title: "用户id", type: "text", width: 150, mode: "=", show:["none"] }
					]
					// 查询表单的字段规则 fieldName:指定数据库字段名,不填默认等于key
				},
				form1:{
					_id:"",
					type:1,
				},
				formData1:{
					// 表单请求地址
					action:"",
					// 表单字段显示规则
					columns:[
						{ key:"type", title:"提现方式", type:"radio", optionType:"button",
							data:[
								{ value:1, label:"支付宝" }
							]
						},
						{ key:"account_no", title:"提现账户", type:"text" },
						{ key:"name", title:"提现人姓名", type:"text" },
						{ key:"mobile", title:"提现人手机号", type:"text" },
						{ key:"is_default", title:"是否默认", type:"switch", activeValue:true, inactiveValue:false }
					],
					// 表单对应的验证规则
					rules: {
						type: [
							{ required:true,  message: '提现方式不能为空', trigger: ['blur','change'] }
						],
						account_no: [
							{ required:true,  message: '提现账户不能为空', trigger: ['blur','change'] }
						],
						name: [
							{ required:true,  message: '提现人姓名不能为空', trigger: ['blur','change'] }
						],
						mobile: [
							{ required:true,  message: '提现人手机号不能为空', trigger: ['blur','change'] },
							{ validator: vk.pubfn.validator("mobile"),  message: '手机号格式错误', trigger: ['blur','change'] }
						],
					},
					// add 代表添加 update 代表修改
					formType:'',
					// 是否显示表单1 的弹窗
					show: false,
				}
				// 表单相关结束-----------------------------------------------------------
			};
		},
		created() {
			that = this;
			that.init();
		},
		mounted() {

		},
		methods: {
			// 初始化
			init(){
				that.queryForm1.formData.user_id = that.user._id;
			},
			// 页面打开
			pageOpen(){
				that = this;
				let { value, form1 } = that;
				let { item } = value;
			},
			// 页面关闭
			pageClose(){

			},
			// 页面返回
			pageBack(){
				let { value } = that;
				value.show = false;
				that.$emit('input', value);
			},
			// 搜索
			search(){
				that.$refs.table1.query();
			},
			// 刷新
			refresh(){
				that.$refs.table1.refresh();
			},
			// 获取当前选中的行的数据
			getCurrentRow(){
				return that.$refs.table1.getCurrentRow();
			},
			currentChange(val){
				that.table1.selectItem = val;
			},
			// 当选择项发生变化时会触发该事件
			selectionChange(list) {
				that.table1.multipleSelection = list;
			},
			// 显示添加页面
			addBtn(){
				that.form1 = {
					user_id: that.user._id,
					type: 1,
					mode:"add"
				};
				that.formData1.action = 'admin/business/sys/user.editWithdrawalWay';
				that.formData1.formType = 'add';
				that.formData1.title = '添加';
				that.formData1.show = true;
			},
			// 显示修改页面
			updateBtn({ item }){
				that.formData1.action = 'admin/business/sys/user.editWithdrawalWay';
				that.formData1.formType = 'update';
				that.formData1.title = '编辑';
				that.formData1.show = true;
				that.form1 = {
					...item,
					mode:"update"
				};
			},
			// 删除按钮
			deleteBtn({ item, deleteFn }){
				deleteFn({
					action:"admin/business/sys/user.deleteUserWithdrawalWay",
					data:{
						_id: item._id,
					},
				});
			},
		},
		// 监听属性
		watch: {

		},
		// 计算属性
		computed: {

		}
	};
</script>

<style lang="scss" scoped>

</style>
